<div id ="avgRatings">
Average User Ratings
</div>
<div id ="holder"></div>
<?php 
$count = null;
$this->dojo()->enable();
foreach($this->paginator as $list) {

$count = $list['recount'];
$dat = "Number of respondents :" .$list['recount'] ."<br>"
 ."Community Module Score :" .$list['community'] . "<br>"
 ."Student Module Score: " .$list['student'] . "<br>";
}

$legend= "1-- Very Poor, 2-- Poor, 3 -- Average, 4--Good, 5-- Great";
?>
<?php if ($count == 0){
$msg = "No data exists";
}
else{
$msg="Plot of Average ratings" ;
}?>
<p></p>
<h3><?php echo $msg;?></h3>
<script type="text/javascript">

dojo.require("dojox.charting.Chart2D");
dojo.require("dijit.TitlePane");

makeCharts = function(){

        var chart1 = new dojox.charting.Chart2D("simplechart");
        chart1.addPlot("default", {type: "Columns", gap: 10});
        chart1.addAxis("y", {vertical: true, min: 0, max: 5,  stroke: "black"});
        chart1.addAxis("x", {
            labels: [{value: 1, text: "Community Module" }, {value: 2, text: "Student Module"}]
            });   chart1.addSeries("Series 1", [<?php echo $list['community']; ?>, <?php echo $list['student'];?>],{stroke: {color: "black", width: 1.5}, 
        fill: "red"}        
        );
        chart1.render();
       
};


add = function() {

    legend = new dijit.TitlePane({
        title: "Rating Legend",
        content: "<?php echo $legend; ?>", 
        open: false
    });


    com = new dijit.TitlePane({
        title: "<?php echo $this->name;?>",
        content: "<?php echo $dat; ?>", 
        style: "width:300px",  
        open: false
    });
    
    dojo.byId("holder").appendChild(com.domNode);
    dojo.byId("legend").appendChild(legend.domNode);
};
dojo.addOnLoad(makeCharts);
dojo.addOnLoad(add);

</script>

<div id="simplechart" align = "left" style="width: 600px; height: 200px;"></div>

<div id="legend"></div>